<template>
  <Dialog v-model="dialogVisible" title="商家信息" width="60%">
    <ContentWrap>

      <el-descriptions :column="2" label-class-name="desc-label">
        <el-descriptions-item label="LOGO" prop="name">
          <img :src="formData.logo" width="120" />
        </el-descriptions-item>
        <el-descriptions-item label="商家状态" prop="status">
          <dict-tag :type="DICT_TYPE.AUDIT_STATUS" :value="formData.status" size="small" />
        </el-descriptions-item>
      </el-descriptions>
      <el-divider />
      <el-descriptions :column="2" label-class-name="desc-label">
        <el-descriptions-item label="商家名称" prop="name">
          {{ formData.name }}
        </el-descriptions-item>
        <el-descriptions-item label="经营品类" prop="categoryId">
          {{ formatCategoryName(formData.categoryId) }}
        </el-descriptions-item>
        <el-descriptions-item label="联系电话" prop="mobile">
          {{ formData.mobile }}
        </el-descriptions-item>

        <el-descriptions-item label="身份类型">
          <dict-tag :type="DICT_TYPE.MERCHANT_IDENTITY_TYPE" :value="formData.identityType" size="small" />
        </el-descriptions-item>

      </el-descriptions>
      <el-divider />
      <el-descriptions :column="2">

        <el-descriptions-item label="法人姓名" prop="legalName">{{ formData.legalName }}</el-descriptions-item>
        <el-descriptions-item label="法人电话" prop="legalPhone">{{ formData.legalPhone }}</el-descriptions-item>
        <el-descriptions-item label="身份证号" prop="legalIdCardNo">{{ formData.legalIdCardNo }}</el-descriptions-item>

        <el-descriptions-item label="发货方式" prop="deliveryType">
          <dict-tag :type="DICT_TYPE.MERCHANT_DELIVERY_TYPE" :value="formData.deliveryType" size="small" />
        </el-descriptions-item>

        <el-descriptions-item label="商家描述" prop="descrption">
          {{ formData.description }}
        </el-descriptions-item>
        <el-descriptions-item label="统一社会信用代码" v-if="formData.identityType != 1" prop="creditCode">{{
          formData.creditCode }}</el-descriptions-item>
        <el-descriptions-item label="信用代码生效日期" v-if="formData.identityType != 1" prop="creditCodeEffectDate">
          {{ formatDate(formData.creditCodeEffectDate, 'YYYY-MM-DD') }}
        </el-descriptions-item>
        <el-descriptions-item label="信用代码失效日期" v-if="formData.identityType != 1" prop="creditCodeExpireDate">
          {{ formatDate(formData.creditCodeExpireDate, 'YYYY-MM-DD') }}
        </el-descriptions-item>
      </el-descriptions>
      <el-divider />
      <el-descriptions :column="1">
        <el-descriptions-item label="所在地" prop="areaId">{{ formData.areaName }}</el-descriptions-item>
        <el-descriptions-item label="详细地址" prop="address">{{ formData.address }}</el-descriptions-item>
      </el-descriptions>
      <el-divider />
      <el-descriptions :column="1">
        <el-descriptions-item label="经营范围" prop="businessScope">{{ formData.businessScope }}</el-descriptions-item>
      </el-descriptions>

      <div style="text-align: right">
        <el-radio-group v-model="formData.status2" v-if="formData.status === -1">
          <el-radio value="0" label="审核通过" />
          <el-radio value="1" label="审核失败" />
        </el-radio-group>
        <p></p>
        <el-input
style="width: 200px;" type="textarea" v-if="formData.status2 == 1" v-model="formData.auditMessage"
          placeholder="请输入拒绝理由" />
        <p></p>
        <el-button
@click="auditMerchant(formData.id, formData.status2)" v-if="formData.status === -1"
          type="primary">审核</el-button>
        <el-button @click="dialogVisible = false">关闭</el-button>

      </div>
    </ContentWrap>
  </Dialog>
</template>
<script setup lang="ts">
import { MerchantApi } from '@/api/mall/product/merchant';
import { DICT_TYPE } from '@/utils/dict';
import { treeToString, handleTree } from '@/utils/tree';
import { formatDate } from '@/utils/formatTime';
import * as AreaApi from '@/api/system/area'
import * as ProductCategoryApi from '@/api/mall/product/category'
/** 商家信息 表单 */
defineOptions({ name: 'InfoForm' })

const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗

const dialogVisible = ref(false) // 弹窗的是否展示
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formData = ref({
  id: undefined,
  logo: undefined,
  name: undefined,
  identityType: undefined,
  description: undefined,
  categoryId: undefined,
  type: undefined,
  deliveryType: undefined,
  status: undefined,
  legalName: undefined,
  legalPhone: undefined,
  legalIdCardNo: undefined,
  legalIdCardEffectDate: undefined,
  legalIdCardExpireDate: undefined,
  businessScope: undefined,
  creditCode: undefined,
  creditCodeEffectDate: undefined,
  creditCodeExpireDate: undefined,
  areaId: undefined,
  areaName: undefined,
  address: undefined,
  mobile: undefined,
})


const areaList = ref([]) // 地区列表
const categoryList = ref() // 分类树
const formatCategoryName = (categoryId: number) => {
  debugger
  return treeToString(categoryList.value, categoryId)
}
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
const auditMerchant = async (id: number, status: number) => {

  if (!id) {
    message.alert("请选择商家");
    return;
  }
  if (!status) {
    message.alert("请选择审核结果");
    return;
  }
  if (status == 1) {
    if (!formData.value.auditMessage) {
      message.alert("请输入拒绝理由");
      return;
    }
  }
  var data = { "id": id, "status": status, "auditMessage": formData.value.auditMessage };
  await MerchantApi.auditMerchant(data);
  message.success("审核成功")
  dialogVisible.value = false
  emit('success')
}
/** 打开弹窗 */
const open = async (id?: number) => {
  dialogVisible.value = true
  areaList.value = await AreaApi.getAreaTree()


  // 修改时，设置数据
  if (id) {
    formLoading.value = true
    try {
      formData.value = await MerchantApi.getInfo(id)

      const data = await ProductCategoryApi.getCategoryList({})
      categoryList.value = handleTree(data, 'id', 'parentId');
    } finally {
      formLoading.value = false
    }
  }
}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗

</script>